.grid-sizer {
  width: 100%;
}
.width-40 {
  width: 40% !important;
}
.width-50 {
  width: 50% !important;
}
.width-60 {
  width: 60% !important;
}
.width-70 {
  width: 70% !important;
}
.width-80 {
  width: 80% !important;
}
.width-90 {
  width: 90% !important;
}
.width-95 {
  width: 95% !important;
}
.grid {
  margin: 0 auto;
}
.justify-1 {
  margin: 0;
}
.justify-2 {
  margin: 0 auto;
}
.justify-3 {
  margin: 0 0 0 auto;
}
.btn-primary {
  background-color: #2196F3;
  border-color: #2196F3;
}
.btn-primary:hover {
  background-color: #1e87db;
  border-color: #1e87db;
}
/* The switch - the box around the slider */
.switch-checkbox {
  position: relative;
  display: inline-block;
  width: 45px;
  height: 24px;
  top: 5px;
}
/* Hide default HTML checkbox */
.switch-checkbox input {
  display: none;
}
/* The slider */
.slider-checkbox {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}
.slider-checkbox:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}
input:checked + .slider-checkbox {
  background-color: #2196F3;
}
input:focus + .slider-checkbox {
  box-shadow: 0 0 1px #2196F3;
}
input:checked + .slider-checkbox:before {
  -webkit-transform: translateX(22px);
  -ms-transform: translateX(22px);
  transform: translateX(22px);
}
/* Rounded slider-checkboxs */
.slider-checkbox.round {
  border-radius: 34px;
}
.slider-checkbox.round:before {
  border-radius: 50%;
}
/* clear fix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}
.grid-item {
  float: left;
  padding: 2px;
  cursor: move;
}
@media (min-width: 10px) {
  .grid-sizer,
  .grid-item,
  .grid-item--width2 {
    width: 100%;
  }
  .grid-sizer {
    width: 100%;
  }
}
@media (min-width: 651px) {
  .grid-sizer,
  .grid-item,
  .grid-item--width2 {
    width: 49.5%;
  }
}
@media (min-width: 1024px) {
  .grid-sizer,
  .grid-item,
  .grid-item--width2 {
    width: 30%;
  }
}
@media (min-width: 1240px) {
  /* Default */
  .grid-sizer,
  .grid-item {
    width: 10%;
  }
  .grid-item--width2 {
    width: 20%;
  }
  /* /Default */
  .grid-sizer-1,
  .grid-item-1 {
    width: 100%;
  }
  .grid-item-1.grid-item--width2 {
    width: 100%;
  }
  .grid-sizer-2,
  .grid-item-2 {
    width: 50%;
  }
  .grid-item-2.grid-item--width2 {
    width: 50%;
  }
  .grid-sizer-3,
  .grid-item-3 {
    width: 30%;
  }
  .grid-item-3.grid-item--width2 {
    width: 60%;
  }
  .grid-sizer-4,
  .grid-item-4 {
    width: 25%;
  }
  .grid-item-4.grid-item--width2 {
    width: 50%;
  }
  .grid-sizer-5,
  .grid-item-5 {
    width: 20%;
  }
  .grid-item-5.grid-item--width2 {
    width: 40%;
  }
  .grid-sizer-6,
  .grid-item-6 {
    width: 16.6%;
  }
  .grid-item-6.grid-item--width2 {
    width: 33.2%;
  }
  .grid-sizer-7,
  .grid-item-7 {
    width: 14.2%;
  }
  .grid-item-7.grid-item--width2 {
    width: 28.4%;
  }
  .grid-sizer-8,
  .grid-item-8 {
    width: 12.5%;
  }
  .grid-item-8.grid-item--width2 {
    width: 25%;
  }
  .grid-sizer-9,
  .grid-item-9 {
    width: 11%;
  }
  .grid-item-9.grid-item--width2 {
    width: 22%;
  }
  .grid-sizer-10,
  .grid-item-10 {
    width: 10%;
  }
  .grid-item-10.grid-item--width2 {
    width: 20%;
  }
  .grid-sizer-11,
  .grid-item-11 {
    width: 9%;
  }
  .grid-item-11.grid-item--width2 {
    width: 18%;
  }
  .grid-sizer-12,
  .grid-item-12 {
    width: 8.3%;
  }
  .grid-item-12.grid-item--width2 {
    width: 16.6%;
  }
  .grid-sizer-13,
  .grid-item-13 {
    width: 7.6%;
  }
  .grid-item-13.grid-item--width2 {
    width: 15.3%;
  }
  .grid-sizer-14,
  .grid-item-14 {
    width: 7.1%;
  }
  .grid-item-14.grid-item--width2 {
    width: 14.2%;
  }
  .grid-sizer-15,
  .grid-item-15 {
    width: 6.6%;
  }
  .grid-item-15.grid-item--width2 {
    width: 13.2%;
  }
  .grid-sizer-16,
  .grid-item-16 {
    width: 6.25%;
  }
  .grid-item-16.grid-item--width2 {
    width: 12.5%;
  }
  .grid-sizer-17,
  .grid-item-17 {
    width: 5.8%;
  }
  .grid-item-17.grid-item--width2 {
    width: 11.6%;
  }
  .grid-sizer-18,
  .grid-item-18 {
    width: 5.5%;
  }
  .grid-item-18.grid-item--width2 {
    width: 11%;
  }
  .grid-sizer-19,
  .grid-item-19 {
    width: 5.2%;
  }
  .grid-item-19.grid-item--width2 {
    width: 10.4%;
  }
  .grid-sizer-20,
  .grid-item-20 {
    width: 5%;
  }
  .grid-item-20.grid-item--width2 {
    width: 10%;
  }
  .distance-0 {
    padding: 0px;
  }
  .distance-1 {
    padding: 0.5px;
  }
  .distance-2 {
    padding: 1px;
  }
  .distance-3 {
    padding: 1.5px;
  }
  .distance-4 {
    padding: 2px;
  }
  .distance-5 {
    padding: 2.5px;
  }
  .distance-6 {
    padding: 3px;
  }
  .distance-7 {
    padding: 3.5px;
  }
  .distance-8 {
    padding: 4px;
  }
  .distance-9 {
    padding: 4.5px;
  }
  .distance-10 {
    padding: 5px;
  }
  .distance-11 {
    padding: 5.5px;
  }
  .distance-12 {
    padding: 6px;
  }
  .distance-13 {
    padding: 6.5px;
  }
  .distance-14 {
    padding: 7px;
  }
  .distance-15 {
    padding: 7.5px;
  }
  .distance-16 {
    padding: 8px;
  }
  .distance-17 {
    padding: 8.5px;
  }
  .distance-18 {
    padding: 9px;
  }
  .distance-19 {
    padding: 9.5px;
  }
  .distance-20 {
    padding: 10px;
  }
  .distance-21 {
    padding: 10.5px;
  }
  .distance-22 {
    padding: 11px;
  }
  .distance-23 {
    padding: 11.5px;
  }
  .distance-24 {
    padding: 12px;
  }
  .distance-25 {
    padding: 12.5px;
  }
  .distance-26 {
    padding: 13px;
  }
  .distance-27 {
    padding: 13.5px;
  }
  .distance-28 {
    padding: 14px;
  }
  .distance-29 {
    padding: 14.5px;
  }
  .distance-30 {
    padding: 15px;
  }
}
.grid-item img {
  display: block;
  max-width: 100%;
}
.grid-item > div {
  position: relative;
}
.grid-item > div:hover {
  background: white;
}
#wrapper .grid-item > div a.fa,
.grid-stack-item div a.fa {
  position: absolute;
  top: 0;
  right: 5px;
  font-size: 25px;
  cursor: pointer;
  color: white;
  font-weight: normal;
}
#wrapper .grid-item > div a.fa:hover,
.grid-stack-item div a:hover {
  text-decoration: none;
}
#wrapper .grid-item > div a.fa-times,
.grid-stack-item div a:fa-times {
  right: 5px;
  text-shadow: 1px 1px #212121;
}
#wrapper .grid-item > div div.settings-box,
.grid-stack-item div div.settings-box {
  position: absolute;
  left: 5px;
  bottom: 5px;
}
#wrapper .grid-item > div div.settings-box .popover,
.grid-stack-item div div.settings-box .popover {
  width: 155px;
}
#wrapper .grid-item > div div.settings-box .popover.url-popover,
.grid-stack-item div div.settings-box .popover.url-popover {
  width: 355px;
}
#wrapper .grid-item > div div.settings-box .popover .popover-content label {
  margin-right: 10px;
  cursor: pointer;
}
#wrapper .grid-item > div div.settings-box .popover .popover-content label input {
  margin-left: 3px;
}
#wrapper .grid-item > div div.settings-box a:hover {
  text-decoration: none;
}
#wrapper .grid-item > div div.settings-box .fa,
.grid-stack-item div div.settings-box .fa {
  font-size: 25px;
  cursor: pointer;
  color: white;
  font-weight: normal;
  text-shadow: 1px 1px #212121;
  margin-right: 5px;
}
#wrapper .grid-item > div div.settings-box .fa.active,
.grid-stack-item div div.settings-box .fa.active {
  color: #ff3333;
  -moz-text-shadow: 1px 1px blur #BF2A2A;
  -ms-text-shadow: 1px 1px blur #BF2A2A;
  -o-text-shadow: 1px 1px blur #BF2A2A;
  text-shadow: 1px 1px blur #BF2A2A;
}
.placeholder {
  background: #eee;
  height: 200px;
}
